<template>
  <!-- 分享引导 -->
  <uv-popup ref="sharePopupGuide" mode="top" :safeAreaInsetTop="true" bgColor="none" zIndex="999" @touchmove.stop.prevent="" @change="onChangePopup">
    <view class="guide-wrap">
      <image class="guide-image" :src="$CDN('/common/static/images/share/share_guide.png')"></image>
    </view>
  </uv-popup>
</template>

<script>
import { mapGetters, mapActions } from 'vuex'
export default {
  name: 'cuShareGuide',
  components: {},
  mixins: [],
  props: {
    shareInfo: {
      type: Object,
      default: () => {
        return {}
      },
    },
  },
  data() {
    return {}
  },
  watch: {
    shareGuide: {
      immediate: true,
      handler(nv) {
        this.$nextTick(() => {
          if (nv) this.openShareGuide()
          else this.closeShareGuide()
        })
      },
    },
  },
  // 计算属性
  computed: {
    ...mapGetters(['shareGuide']),
  },

  created() {},
  mounted() {},
  destroyed() {},
  options: {},
  methods: {
    ...mapActions('modal', ['SetShareGuide']),

    // open-share-guide
    openShareGuide() {
      this.$refs.sharePopupGuide.open()
    },

    // close-share-guide
    closeShareGuide() {
      this.SetShareGuide(false)
      this.$refs.sharePopupGuide.close()
    },

    onChangePopup(e) {
      if (!e.show) this.SetShareGuide(false)
    },
  },
}
</script>

<style lang="scss" scoped>
.guide-wrap {
  padding: 40rpx 30rpx;
  text-align: center;
}
</style>
